import React, { useState, useEffect } from 'react'
import { message, Modal } from 'antd'
import _ from 'loadsh'
import CodeInput from './components/CodeInput'
import EmsList from './components/EmsList'
import Footer from './components/Footer'
import { updateServiceRequest, getEmsInfosRequest, getPdfRequest } from './ajax'
import { awaitWrap } from '@js/tool'

// 更新邮单
async function updateEmscode (data, emscode, refreshCurrentTableFn, refreshCurrentServiceFn) {
  const hide = message.loading('提交中', 120)
  data = _.cloneDeep(data)
  const id = data.id
  delete data.id
  data.emscode = emscode
  if (data.status === '打印邮单') {
    data.status = '录入邮单'
  }
  const [e] = await awaitWrap(updateServiceRequest(id, data))
  hide()
  if (e) {
    return message.error(e.message)
  }
  refreshCurrentTableFn()
  refreshCurrentServiceFn()
}

// 更新送达状态
async function updateStatus (d, data, hide, refreshCurrentTableFn) {
  const h = message.loading('提交中', 120)
  d = _.cloneDeep(d)
  const id = d.id
  delete d.id
  d.status = data.status
  d.status_ex = data.status_ex
  d.remark = data.remark
  d.arrive_datetime = Math.floor(data.arrive_datetime.valueOf() / 1000)
  const [e] = await awaitWrap(updateServiceRequest(id, d))
  h()
  if (e) {
    return message.error(e.message)
  }
  hide()
  refreshCurrentTableFn()
}

// 获取ems状态
async function getEmsInfos (code, caseid, setEmsLoading, setEmsInfos) {
  setEmsLoading(true)
  const [e, d] = await awaitWrap(getEmsInfosRequest(code, caseid))
  setEmsLoading(false)
  if (e) {
    return message.error(e.message)
  }
  setEmsInfos(d)
}

// 查看ems pdf
async function readEmsPdf (emscode, caseid, common, dispatch, setPdfLoading) {
  setPdfLoading(true)
  const [e, d] = await awaitWrap(getPdfRequest(emscode, caseid))
  setPdfLoading(false)
  if (e) {
    return message.error(e.message)
  }
  dispatch({ type: 'emsModalVisible', data: false })
  common.$readerPdf('EMS邮单轨迹', d, caseid)
}

// 改变ems码
function changeEmsCode (emscode, data, setEmscode, refreshCurrentTableFn, refreshCurrentServiceFn) {
  setEmscode(emscode)
  updateEmscode(data, emscode, refreshCurrentTableFn, refreshCurrentServiceFn)
}

function Main ({ editable, caseDetail, theme, visible, hide, data, common, pDispatch, dictionaries, refreshCurrentTableFn, refreshCurrentServiceFn }) {
  const [modifiable, setModifiable] = useState(false)
  const [emscode, setEmscode] = useState('')
  const [emsLoading, setEmsLoading] = useState(false)
  const [pdfLoading, setPdfLoading] = useState(false)
  const [emsInfos, setEmsInfos] = useState([])
  useEffect(() => {
    if (data && theme && visible) {
      setModifiable((editable && !theme.complete_datetime) && ['送达', '视为送达', '送达失败'].indexOf(data.status) === -1)
      if (data.emscode) {
        setEmscode(data.emscode || '')
        getEmsInfos(data.emscode, caseDetail.id, setEmsLoading, setEmsInfos)
      }
    }
  }, [data, editable, caseDetail, theme, visible])
  useEffect(() => {
    if (!visible) {
      setEmscode('')
      setEmsInfos([])
      setModifiable(false)
      setEmsLoading(false)
      setPdfLoading(false)
    }
  }, [visible])
  return (
    <Modal
      title={modifiable ? '录入邮单' : '查看邮单'}
      width={800}
      open={visible}
      maskClosable={false}
      destroyOnClose
      onCancel={hide}
      footer={visible ? <Footer readOnly={!modifiable} dictionaries={dictionaries} data={data} hide={hide} visible={visible} finishStatus={d => updateStatus(data, d, hide, refreshCurrentTableFn)} emscode={emscode} /> : null}
    >
      <div>
        <CodeInput modifiable={modifiable} pdfLoading={pdfLoading} setEmscode={c => changeEmsCode(c, data, setEmscode, refreshCurrentTableFn, refreshCurrentServiceFn)} readEmsPdf={() => readEmsPdf(emscode, caseDetail.id, common, pDispatch, setPdfLoading)} emscode={emscode} />
        <EmsList emsLoading={emsLoading} emsInfos={emsInfos} />
      </div>
    </Modal>
  )
}

export default Main
